<template>
	<view class="student-archives">
		<view class="title bold">我的学员({{itemArr.length}}人)</view>
		
		<u-index-list :index-list="indexList" :top-height="50">
			<template v-for="(item, index) in itemArr">
				<!-- #ifdef APP-NVUE -->
				<!-- <u-index-anchor :text="indexList[index]"></u-index-anchor> -->
				<!-- #endif -->
				
				<u-index-item>
					<!-- #ifndef APP-NVUE -->
					<!-- <u-index-anchor :text="indexList[index]"></u-index-anchor> -->
					<!-- #endif -->
					<view class="list-cell flex-align">
						<u-avatar :src="cell.avatar" size="90rpx"></u-avatar>
						<view class="right flex-grow-1">
							<view class="name">{{ item.student_info['姓名'] }}</view>
							<view class="phone">{{item.student_info['手机号'] }}</view>
						</view>
					</view>
				</u-index-item>
			</template>
		</u-index-list>
		
		<view class="bottom-add-btn">
			<u-button text="添加学员" shape="circle" @click="add" color="linear-gradient(0deg, rgb(47, 117, 250) 0%, rgb(82, 142, 255) 100%)"></u-button>
		</view>
	</view>
</template>

<script>
const index = require('@/api/train/index.js')
export default {
	onLoad(options) {
		this.selectStudent()
	},
	data() {
		return {
			// indexList: ["A", "B", "C"],
			itemArr: [
				[
					{
						avatar: '',
						name: 'A蒋宗延xxx',
						phone: '15849214234'
					},
					{
						avatar: '',
						name: 'A蒋宗延',
						phone: '15849214234'
					}
				],
				[
					{
						avatar: '',
						name: 'B蒋宗延',
						phone: '15849214234'
					},
					{
						avatar: '',
						name: 'B蒋宗延',
						phone: '15849214234'
					}
				],
				[
					{
						avatar: '',
						name: 'C蒋宗延',
						phone: '15849214234'
					},
					{
						avatar: '',
						name: 'C蒋宗延',
						phone: '15849214234'
					}
				]
			]
		}
	},
	methods: {
		async selectStudent(){
			let params = {
				openid: uni.getStorageSync('openid'),
				app_id: this.$https.weixinAppId,
				project_id: getApp().globalData.projectId,	
				
			}
			let res = await index.selectStudent(params)
			if(res.code == 1){
				console.log(res.data)
				this.itemArr = res.data.train
			}
		},
		add() {
			uni.navigateTo({
				url: '/pages/personal/student-archives/add/add'
			});
		}

	}
}
</script>

<style lang="scss" scoped>
.student-archives {
	padding: 0 34rpx;
	
	/deep/.u-index-list {
		scroll-view {
			height: calc(100vh - 220rpx - env(safe-area-inset-bottom));;
		}
	}
	
	.title {
		font-size: 32rpx;
		height: 100rpx;
		padding-top: 40rpx;
		
		&::before {
			content: '';
			display: inline-block;
			width: 6rpx;
			height: 28rpx;
			background-color: #0072ff;
			margin-top: 2rpx;
			margin-right: 22rpx;
		}
	}
	
	.list-cell {
		padding: 24rpx 0;
		position: relative;
		
		&::before {
			content: '';
			position: absolute;
			left: 110rpx;
			bottom: 0;
			right: 0;
			height: 1px;
			background-color: #f2f2f2;
		}
		
		.right {
			margin-left: 20rpx;
		}
		
		.phone {
			font-size: 22rpx;
			font-weight: 400;
			margin-top: 10rpx;
			color: #BEBEBE;
		}
	}
}
</style>
